﻿@{
    Layout = "_LoginLayout";
    ViewData["Title"] = "上位机-二维码登录";
    var clientId = ViewData["ClientId"];
    var timeStamp = ViewData["TimeStamp"];
}

<style>

    .login-right {
        justify-content: center;
        padding: 30px 25px 0px 25px;
    }

    .qr-content {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .qr-border {
        border-radius: 5px;
        overflow: hidden;
        position: relative;
    }

    .qr-image {
        display: flex;
        width: 200px;
        height: 200px;
    }

    .qr-image {
        display: flex;
        width: 200px;
        height: 200px;
    }

    .label-phonedes {
        color: #06B025;
    }

    .qr-mask {
        background-color: #00000077;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .label-div {
        margin: 3px 0px 0px 0px;
    }

    .label-qrfail {
        color: #fff;
    }

    .btn-refresh {
        background: linear-gradient(to bottom right, #2FCDF3 0%, #00E138 100%);
        color: #fff;
        padding: 5px 15px;
        border-radius: 5px;
        border: none;
    }

        .btn-refresh:hover {
            opacity: 0.95;
        }

    .btn-password-login {
        margin: 5px 0px 0px 5px;
    }
</style>
<div class="qr-content">
    <a class="btn-password-login" href="/Login/Index?ClientId=@clientId&Timestamp=@timeStamp">
        <svg t="1743605634370" class="icon-qrcode" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9813" width="64" height="64">
            <defs>
                <linearGradient id="myGradient" x1="0%" y1="0%" x2="100%" y2="100%">
                    <stop offset="0%" stop-color="#198cff" />
                    <stop offset="100%" stop-color="#1afa29" />
                </linearGradient>
            </defs>
            <path d="M179.928679 827.214807H98.461618A98.619058 98.619058 0 0 1 0.000098 728.615441V98.461716a98.46152 98.46152 0 0 1 98.46152-98.461519h847.005376a97.910135 97.910135 0 0 1 78.454138 39.069531l-63.999987 59.785835a39.384608 39.384608 0 0 0-34.303994-20.105843H118.39023a39.384608 39.384608 0 0 0-39.384608 39.384608v590.769117a39.561839 39.561839 0 0 0 39.384608 39.542146h145.841202z" fill="url(#myGradient)" p-id="9814"></path>
            <path d="M390.931716 630.291768h-174.198121a19.692304 19.692304 0 0 1-19.692304-19.692304V216.635232a19.692304 19.692304 0 0 1 19.692304-19.692304h610.461421a19.692304 19.692304 0 0 1 17.073228 9.964306l-453.375913 423.384534z" fill="url(#myGradient)" p-id="9815"></path>
        </svg>
    </a>

    <div class="qr-border">
        <img class="qr-image" src="" alt="">
        <div class="qr-mask">
            <label class="label-qrfail">二维码失效</label>
            <button class="btn-refresh">刷新重试</button>
        </div>
    </div>
    <div class="label-div">
        打开<label class="label-phonedes">手机APP</label> 扫码登录
    </div>
</div>
